<!doctype html>
<html class="no-js">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="description" content="">
  <meta name="keywords" content="">
  <meta name="viewport"
        content="width=device-width, initial-scale=1">
  <title>结算页面</title>

  <!-- Set render engine for 360 browser -->
  <meta name="renderer" content="webkit">

  <!-- No Baidu Siteapp-->
  <meta http-equiv="Cache-Control" content="no-siteapp"/>

  <link rel="icon" type="image/png" href="i/favicon.png">

  <!-- Add to homescreen for Chrome on Android -->
  <meta name="mobile-web-app-capable" content="yes">
  <link rel="icon" sizes="192x192" href="i/app-icon72x72@2x.png">

  <!-- Add to homescreen for Safari on iOS -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="Amaze UI"/>
  <link rel="apple-touch-icon-precomposed" href="i/app-icon72x72@2x.png">

  <!-- Tile icon for Win8 (144x144 + tile color) -->
  <meta name="msapplication-TileImage" content="i/app-icon72x72@2x.png">
  <meta name="msapplication-TileColor" content="#0e90d2">

  <link rel="stylesheet" href="__TMPL__/public/menu/css/amazeui.css">
  <link rel="stylesheet" href="__TMPL__/public/menu/css/jiesuan.css">
</head>
<body>
	<header data-am-widget="header" class="am-header am-header-default">
		<div class="am-header-left am-header-nav">
      		<a href="javascript:void(0);" onclick="javascript:history.back(-1);return false;">返回
      			<!--<i class="am-header-icon am-icon-chevron-left"></i>-->
      		</a>
  		</div>
		<h1 class="am-header-title">
			<a href="#title-link">结账</a>
			<div class="orderid" ></div>
		</h1>
	</header>
	<section class="wapper">
		<div class="am-g am-padding am-posre">
			<!--左边内容-->
			<section class="am-u-sm-6 am-u-md-6 am-u-lg-6">
				<div class="" style="margin-bottom: 10rem;">
					<div data-am-widget="titlebar" class="am-titlebar am-titlebar-default" >
					    <h2 class="am-titlebar-title">选择其他支付方式</h2>
					</div>
					<div class="am-margin-top am-margin-left-sm pay_type">
						<ul class="am-list am-avg-sm-3 am-avg-md-3 am-avg-lg-3 am-thumbnails">
							<li id="balance">
								<img class="am-thumbnail"  src="__TMPL__/public/menu/img/yl.png" />
								<label>会员卡支付</label>
							</li>
							<li id="currency">
								<img class="am-thumbnail" src="__TMPL__/public/menu/img/yl.png" />
								<label>现金支付</label>
							</li>
							<li>
								<img class="am-thumbnail" src="__TMPL__/public/menu/img/yl.png" />
								<label>微信支付</label>
							</li>
							<li>
								<img class="am-thumbnail" src="__TMPL__/public/menu/img/yl.png" />
								<label>银行卡</label>
							</li>
							<li>
								<img class="am-thumbnail" src="__TMPL__/public/menu/img/yl.png" />
								<label>储值卡</label>
							</li>
							<li>
								<img class="am-thumbnail" src="__TMPL__/public/menu/img/yl.png" />
								<label>积分付款</label>
							</li>
						</ul>
					</div>
				</div>
				<div class="">
					<div data-am-widget="titlebar" class="am-titlebar am-titlebar-default" >
					    <h2 class="am-titlebar-title">其他操作</h2>
					</div>
					<div class="am-margin-top am-margin-left-sm other">
						<ul class="am-list am-avg-sm-3 am-avg-md-3 am-avg-lg-3 am-thumbnails">
							<li class="am-sc-bg">
								<img class="am-thumbnail" src="__TMPL__/public/menu/img/yl.png" />
								<label>会员</label>
							</li>
							<li>
								<img class="am-thumbnail" src="__TMPL__/public/menu/img/yl.png" />
								<label>整单折扣</label>
							</li>
							<li>
								<img class="am-thumbnail" src="__TMPL__/public/menu/img/yl.png" />
								<label>整单取消</label>
							</li>
						</ul>
					</div>
				</div>
			</section>
			<!--分割线-->
			<div class="am-divider"></div>
			<!--右边内容-->
			<section class="am-u-sm-6 am-u-md-6 am-u-lg-6" style="margin-top: 3rem;">
				<div class="">
					<form class="am-form am-form-horizontal">
						<div class="am-form-group">
    						<label class="am-u-sm-2 am-form-label">应收：</label>
					    	<div class="am-u-sm-10">
					      		<input type="text" readonly="readonly" class="all_money" value="">
					   	 	</div>
					  	</div>
						<div class="am-form-group input-bg">
    						<label class="am-u-sm-2 am-form-label">待收：</label>
					    	<div class="am-u-sm-10">
					      		<input type="text" class="am-text-white" id="s_pay" readonly="readonly" value="">
					   	 	</div>
					  	</div>
					  	<div class="am-form-group">
    						<label class="am-u-sm-2 am-form-label">现金：</label>
					    	<div class="am-u-sm-10">
					      		<input type="text" class="cash" id="cash" readonly="readonly" value="" style="color:#D10612;">
					   	 	</div>
					  	</div>
					  	<div class="am-form-group am-bg-white am-border am-margin-top-xl">
    						<label class="am-u-sm-2 am-form-label">找零：</label>
					    	<div class="am-u-sm-10">
					      		<input type="text" readonly="readonly" value="" id="giveChange" style="color:#FFA300;">
					   	 	</div>
					  	</div>
					  	<div class="am-form-group keybord-box">
					  		<table class="am-table am-text-center">
					  			<tbody>
					  				<tr>
					  					<td><label class="number" id="7">7</label></td>
					  					<td><label class="number" id="8">8</label></td>
					  					<td><label class="number" id="9">9</label></td>
					  					<td><label class="price am-btn-danger" id="100">￥100</label></td>
					  					<td><label class="delete"><em class="am-icon-mail-reply"></em></label></td>
					  				</tr>
					  				<tr>
					  					<td><label class="number" id="4">4</label></td>
					  					<td><label class="number" id="5">5</label></td>
					  					<td><label class="number" id="6">6</label></td>
					  					<td><label class="price am-btn-danger" id="50">￥50</label></td>
					  					<td><label class="am-normal empty">清空</label></td>
					  				</tr>
					  				<tr>
					  					<td><label class="number" id="1">1</label></td>
					  					<td><label class="number" id="2">2</label></td>
					  					<td><label class="number" id="3">3</label></td>
					  					<td><label class="price am-btn-danger" id="20">￥20</label></td>
					  					<td rowspan="2"><label class="submit am-normal">确定</label></td>
					  				</tr>
					  				<tr>
					  					<td><label class="number" id="00">00</label></td>
					  					<td><label class="number" id="0">0</label></td>
					  					<td><label class="number" id="point">.</label></td>
					  					<td><label class="price am-btn-danger" id="10">￥10</label></td>
					  				</tr>
					  			</tbody>
					  		</table>
					  	</div>
					  	
					</form>
				</div>
			</section>
		</div>
		
	</section>

<!--[if (gte IE 9)|!(IE)]><!-->
<script src="__TMPL__/public/menu/js/jquery.js"></script>
<!--<![endif]-->
<!--[if lte IE 8 ]>
<script src="__TMPL__/public/menu/js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->
<script src="__TMPL__/public/menu/js/amazeui.min.js"></script>
<script>
	$(function(){
		$('.am-table label.number').click(function(){
			var old_text = $('.cash').val();
			var text = $(this).attr('id');
			if(text == "point"){
				if(old_text.indexOf('.') == -1){
					var new_text = old_text + ".";
				}else{
					var new_text = old_text;
				}
			}else{
				var new_text = old_text + text;
			}
			$('.cash').val(new_text);
		})
		
		//选择金额
		$('.am-table label.price').click(function(){
			$('.cash').val($(this).attr('id'));
		})
		
		//删除
		$('.am-table label.delete').click(function(){
			var old_text = $('.cash').val();
			old_text = old_text.substring(0, old_text.length-1);
			$('.cash').val(old_text);
		})
		
		//清空
		$('.am-table label.empty').click(function(){
			$('.cash').val("");
		})
		//确定
		$('.am-table label.submit').click(function(){
			var cash=$('#cash').val();
			var s_pay=$('#s_pay').val();
			var giveChange=cash-s_pay;
			$('#giveChange').val(giveChange);
		})
	})
</script>
	<script>
        var order=parent.$('.orderid').children('input').val();
        var all_money=parent.$('.all').html();
        $('.all_money').val(all_money);
        $('#s_pay').val(all_money);
        $('.orderid').html(order);
        /*
        * 余额支付
        * */
        $('#balance').click(function(){
            var order=$('.orderid').html();
            var s_pay=$('#s_pay').val();
            var state=1;
            var index = parent.layer.getFrameIndex(window.name); //获取当前窗体索引
            $.post("{:url('orderpay/pay')}",{state:state,order:order,s_pay:s_pay},function(data){
                alert(data.msg);
                parent.$('.orderid').html('<input type="hidden" id="orderid" value="">');
                var src = '';
                parent.$('#cart').html(src);
                parent.$('.all').html(src);
                parent.layer.close(index); //执行关闭
            },'json')
        })
        /*
       * 现金支付
       * */
        $('#currency').click(function(){
            var order=$('.orderid').html();
            var s_pay=$('#s_pay').val();
            var cash=$('#cash').val();
            var giveChange=$('#giveChange').val();
            var state=2;
            var index = parent.layer.getFrameIndex(window.name); //获取当前窗体索引
            $.post("{:url('orderpay/pay')}",{state:state,order:order,s_pay:s_pay,giveChange:giveChange,cash:cash},function(data){
                alert(data.msg);
                parent.$('.orderid').html('<input type="hidden" id="orderid" value="">');
                var src = '';
                parent.$('#cart').html(src);
                parent.$('.all').html(src);
                parent.layer.close(index); //执行关闭
            },'json')
        })
        /*
        * 改账
        * */
        $('#amend').click(function(){
            var order=$('.orderid').html();
            var zhekou=$('.amend').val();
            if(!isNaN(zhekou))
            {
                $.post("{:url('orderpay/amend')}",{order:order,zhekou:zhekou},function (data) {
                    $('.s_pay').html(data.msg);
                },'json')
            }else{
                alert('请填写数字！')
                return false;
            }
        })
	</script>
</body>
</html>